<template>
	<uv-popup ref="modal" :bgColor="bgColor" :closeOnClickOverlay="false">
		<view class="ss-w-100 popup-box box-sizing">
			<view class="content-box" :style="{backgroundImage:`url(${sheep.$config.staticUrl}/static/bg/${iconName}.png)`,padding:padding}">
				<slot></slot>
				<!-- <z-button className="ss-w-100" style="position: absolute;bottom: 24rpx;">我知道了</z-button> -->
			</view>
		</view>    
	</uv-popup>
	
</template>

<script setup>	
		import sheep from "@/sheep"
		const props = defineProps({
			modelValue:{
				type:Boolean,
				default:false
			},  
			iconName:{
				type:String,
				default:'ordersuccess-popup' 
			},
			padding:{
				type:String,
				default:'480rpx 130rpx 150rpx 130rpx' 
			},
			iconSize:{
				type:String,
				default:'158rpx'
			},
			title:{
				type:String,
				default:'服务须知'
			},
			bgColor:{
				type:String,
				default:"transparent"
			},
			loanInfo:{
				type:Object,
				default:() => ({}) // 默认值是一个空对象，确保它是一个可响应的对象。
    },
			
		})
		const emit = defineEmits(['update:modelValue','confirm'])
		const state = reactive({
			
		})
		const modal = ref()
		watch(() => props.modelValue,(value) => {
			emit('update:modelValue',value)
			if(value) {
				modal.value.open()
			}
			else modal.value.close()
		})
		const onCancel = () => {
			emit('update:modelValue',false)
		}
		const confirm = () => {		
			// emit('update:modelValue',false)
			if(props.confirmClose) onCancel()
			emit('confirm')
		}
</script>

<style lang="scss" scoped>
	.popup-box {
		width: 750rpx;
		// padding: 0 64rpx;
		position: relative;
		.content-box {
			// min-height: 400rpx;
			background-size:100% 100%;
			background-repeat: no-repeat;
			box-sizing: border-box;
		}
	}
</style>